<template>
  <div class="edu-page-warp">
    <InnerBreadcrumb v-model="indexKey" :path="breadPath" :showBack="true" />
    <div v-show="indexKey == '0'">
      <condition-card @reset="reset" @search="onSubmit" label-width="110px">
        <el-row :gutter="24">
          <!-- <el-col :span="8">
            <el-form-item :label="$t('label.grade')">
              <el-date-picker
                clearable
                v-model="queryForm.grade"
                value-format="yyyy"
                type="year"
                :placeholder="$t('message.plzSelect')"
                style="width: 100%"
              />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item :label="$t('label.college')">
              <el-select
                v-model="queryForm.faculty"
                filterable
                style="width:100%"
                clearable
                @change="handleChangeFaculty"
              >
                <el-option
                  v-for="item in options.faculty"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item :label="$t('label.major')">
              <el-select
                v-model="queryForm.profession"
                filterable
                style="width:100%;height:33px"
                clearable
              >
                <el-option
                  v-for="item in options.profession"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item :label="$t('label.trainingLevel')">
              <el-select v-model="queryForm.trainingLevel" style="width:100%" clearable>
                <el-option
                  v-for="item in options.trainingLevel"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item :label="$t('label.trainingCategory')">
              <el-select v-model="queryForm.trainingCategory" style="width:100%" clearable>
                <el-option
                  v-for="item in options.trainingCategory"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item :label="$t('dic.degreeType')">
              <el-select
                v-model="queryForm.degreeType"
                style="width:100%"
                clearable
                @change="handleChangeFaculty"
              >
                <el-option
                  v-for="item in options.degreeType"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item :label="$t('label.formLearning')">
              <el-select v-model="queryForm.formLearning" style="width:100%" collapse-tags>
                <el-option
                  v-for="item in options.formLearning"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
            </el-form-item>
          </el-col> -->
           <el-col :span="8">
            <el-form-item :label="$t('label.grade')">
              <el-date-picker
                clearable
                v-model="queryForm.grade"
                value-format="yyyy"
                type="year"
                :placeholder="$t('common.text.all')"
                style="width: 100%"
              />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item :label="$t('label.college')">
              <el-select
                filterable
                multiple
                collapse-tags
                style="width:100%"
                clearable
                v-model="queryForm.facultyList"
                @change="handleChangeFaculty"
              >
                <el-option
                  v-for="item in options.faculty"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item :label="$t('label.major')">
              <el-select
                filterable
                style="width:100%"
                multiple
                collapse-tags
                clearable
                v-model="queryForm.professionList"
              >
                <el-option
                  v-for="item in options.profession"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item :label="$t('label.trainingLevel')">
              <el-select
                v-model="queryForm.trainingLevel"
                style="width:100%"
                clearable
              >
                <el-option
                  v-for="item in options.trainingLevel"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item :label="$t('label.trainingCategory')">
              <el-select
                v-model="queryForm.trainingCategory"
                style="width:100%"
                clearable
              >
                <el-option
                  v-for="item in options.trainingCategory"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item :label="$t('dic.degreeType')">
              <el-select
                v-model="queryForm.degreeType"
                style="width:100%"
                clearable
                @change="handleChangeFaculty"
              >
                <el-option
                  v-for="item in options.degreeType"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item :label="$t('label.formLearning')">
              <el-select
                v-model="queryForm.formLearning"
                style="width:100%"
                collapse-tags
              >
                <el-option
                  v-for="item in options.formLearning"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="申请原因">
              <el-select
                filterable
                multiple
                collapse-tags
                style="width:100%"
                clearable
                v-model="applyReasonList"
              >
                <el-option
                  v-for="item in options.applyReason"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="审核状态">
              <el-select
                filterable
                multiple
                collapse-tags
                style="width:100%"
                clearable
                v-model="approvalStatusList"
              >
                <el-option
                  v-for="item in options.approvalStatus"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
      </condition-card>
      <el-card shadow="never">
        <div class="edu-page-title">转导师代申请列表</div>
        <el-row>
          <el-col :span="4">
            <el-input
              v-model="queryForm.keyWord"
              :placeholder="$t('score.failScoreManage.pleaseInt')"
              @keyup.enter.native="onSubmit"
              style="width:200px"
            >
              <i
                class="el-icon-search"
                slot="suffix"
                style="margin-top:10px;cursor:pointer"
                @click="onSubmit"
              ></i>
            </el-input>
          </el-col>
          <div class="float-right" style="display: flex">
              <!-- 新增 -->
              <el-button type="primary" @click="handleAgentApply()">新增</el-button>
          </div>
        </el-row>
        <edu-table
          :data="students"
          size="mini"
          :selection="false"
          :order="false"
          style="width:100%;margin-top:12px"
          @page-change="handleCurrentChange"
          :total="queryForm.total_"
          :pageSize="queryForm.pageSize_"
          :pageNum="queryForm.pageNum_"
        >
          <!-- <el-table-column
            :label="$t('label.stuCode')"
            prop="studentId"
            show-overflow-tooltip
            width="80"
          ></el-table-column>
          <el-table-column
            :label="$t('label.stuName')"
            prop="studentName"
            width="80"
            show-overflow-tooltip
          ></el-table-column>
          <el-table-column :label="$t('label.grade')" prop="grade" width="60"></el-table-column>
          <el-table-column :label="$t('label.college')" show-overflow-tooltip>
            <template slot-scope="scope">{{ scope.row.facultyI18n }}</template>
          </el-table-column>
          <el-table-column :label="$t('label.major')" show-overflow-tooltip>
            <template slot-scope="scope">{{ scope.row.professionI18n }}</template>
          </el-table-column>
          <el-table-column :label="$t('label.trainingLevel')">
            <template slot-scope="scope">{{ scope.row.trainingLevelI18n }}</template>
          </el-table-column>
          <el-table-column :label="$t('label.trainingCategory')">
            <template slot-scope="scope">{{ scope.row.trainingCategoryI18n }}</template>
          </el-table-column>
          <el-table-column :label="$t('dic.degreeType')" prop="degreeType">
            <template slot-scope="scope">{{ scope.row.degreeTypeI18n }}</template>
          </el-table-column>
          <el-table-column :label="$t('label.formLearning')">
            <template slot-scope="scope">{{ scope.row.formLearningI18n }}</template>
          </el-table-column>
          <el-table-column label="导师">
            <template slot-scope="scope">{{ scope.row.oldTeacher }}</template>
          </el-table-column> -->
           <!-- <el-table-column :label="$t('message.operating')" width="60">
              <template slot-scope="scope">
                  <el-button
                      type="text"
                      @click=" handleAgentApply(scope.row) "
                  >{{$t('message.apply')}}</el-button>
              </template>
            </el-table-column> -->
            <el-table-column
            :label="$t('label.stuCode')"
            prop="studentId"
            width="90"
          />
          <el-table-column :label="$t('label.stuName')"  prop="studentName" width="80"/>
          <el-table-column :label="$t('label.grade')" prop="grade" width="60"/>
          <el-table-column
            :label="$t('label.college')"
            width="120"
            prop="facultyI18n"
            show-overflow-tooltip
          />
          <el-table-column
            :label="$t('label.major')"
            width="120"
            prop="professionI18n"
            show-overflow-tooltip
          />
          <el-table-column :label="$t('label.trainingLevel')"  prop="trainingLevelI18n" width="80" show-overflow-tooltip/>
          <el-table-column :label="$t('label.trainingCategory')"  prop="trainingCategoryI18n" show-overflow-tooltip/>
          <el-table-column :label="$t('dic.degreeType')" prop="degreeTypeI18n"  show-overflow-tooltip/>
          <el-table-column :label="$t('dic.formLearning')" prop="formLearningI18n"  show-overflow-tooltip/>
          <el-table-column label="原导师" prop="oldTeacher" show-overflow-tooltip/>
          <el-table-column label="转入导师" prop="newTeacherId" show-overflow-tooltip/>
          <el-table-column
            label="申请原因"
            width="120"
            show-overflow-tooltip
            prop="applyReasonI18n"
          />
          <el-table-column label="申请时间" width="120" show-overflow-tooltip>
            <template slot-scope="scope">{{moment(scope.row.applicationTime)}}</template>
          </el-table-column>
          <el-table-column label="审核状态" prop="approvalStatusI18n" width="90" show-overflow-tooltip>
          </el-table-column>
          <el-table-column label="当前处理人"  width="90" show-overflow-tooltip>
            <template slot-scope="scope">
              <el-button
                v-if="['6','7','8'].includes(scope.row.approvalStatus) && scope.row.reviewerName"
                type="text"
                @click="showUserGroup(scope.row.reviewer)"
              >{{ scope.row.reviewerName }}</el-button>
              <span v-else-if="scope.row.reviewerName">{{ scope.row.reviewerName }}</span>
            </template>
          </el-table-column>
          <el-table-column :label="$t('message.operating')"  width="130" fixed="right">
            <template slot-scope="scope">
              <el-button
                type="text"
                @click="handleDetail(scope)"
              >{{$t('message.detail')}}</el-button>
            </template>
          </el-table-column>
        </edu-table>
      </el-card>
    </div>
    <div v-show="indexKey == '1'">
      <el-card shadow="never">
        <div v-if="!isSingleStudent">
          <div class="edu-page-title">学生信息</div>
          <hr style="margin:10px 0" />
          <el-form label-position="right" label-width="150px" label-suffix="：" id="stu-info" @submit.native.prevent>
            
              <el-row :gutter="24">
              <el-col :span="6">
                <!-- <el-form-item :label="$t('label.stuCode')">{{selectedStudents[0].studentId}}</el-form-item> -->
                <el-form-item
                    :label="$t('label.stuCode')"
                >
                  <el-input
                      v-model="searchStudentId"
                      @blur="getOneStu"
                      style="width:200px"
                      @keyup.enter.native="getOneStu"
                  >
                      <i
                          class="el-icon-search"
                          slot="suffix"
                          style="cursor:pointer"
                          @click="getOneStu"
                      ></i>
                  </el-input>
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item :label="$t('label.stuName')">{{selectedStudents[0].studentName}}</el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item :label="$t('label.college')">{{selectedStudents[0].facultyI18n}}</el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item :label="$t('label.major')">{{selectedStudents[0].professionI18n}}</el-form-item>
              </el-col>
              </el-row>
              <el-row :gutter="24">
              <el-col :span="6">
                <el-form-item :label="$t('label.grade')">{{selectedStudents[0].grade}}</el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="导师">{{selectedStudents[0].oldTeacher}}</el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item
                  :label="$t('label.trainingLevel')"
                >{{selectedStudents[0].trainingLevelI18n}}</el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item
                  :label="$t('label.trainingCategory')"
                >{{selectedStudents[0].trainingCategoryI18n}}</el-form-item>
              </el-col>
              </el-row>
              <el-row :gutter="24">
              <el-col :span="6">
                <el-form-item :label="$t('dic.degreeType')">{{selectedStudents[0].degreeTypeI18n}}</el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item
                  :label="$t('label.formLearning')"
                >{{selectedStudents[0].formLearningI18n}}</el-form-item>
              </el-col>
            </el-row>
          </el-form>
        </div>
        <div v-if="isSingleStudent">
          <div class="edu-page-title">已选择学生</div>
          <edu-table
            :data="selectedStudents"
            :selection="false"
            :order="false"
            :pagination="false"
            style="margin:10px 0 15px"
          >
            <el-table-column
              :label="$t('label.stuCode')"
              prop="studentId"
              show-overflow-tooltip
              width="110"
            ></el-table-column>
            <el-table-column
              :label="$t('label.stuName')"
              prop="studentName"
              width="110"
              show-overflow-tooltip
            ></el-table-column>
            <el-table-column :label="$t('label.grade')" prop="grade"></el-table-column>
            <el-table-column :label="$t('label.college')" show-overflow-tooltip>
              <template slot-scope="scope">{{ scope.row.facultyI18n }}</template>
            </el-table-column>
            <el-table-column :label="$t('label.major')" show-overflow-tooltip>
              <template slot-scope="scope">{{ scope.row.professionI18n }}</template>
            </el-table-column>
            <el-table-column :label="$t('label.trainingLevel')">
              <template slot-scope="scope">{{ scope.row.trainingLevelI18n }}</template>
            </el-table-column>
            <el-table-column :label="$t('label.trainingCategory')">
              <template slot-scope="scope">{{ scope.row.trainingCategoryI18n }}</template>
            </el-table-column>
            <el-table-column :label="$t('dic.degreeType')" prop="degreeType">
              <template slot-scope="scope">{{ scope.row.degreeTypeI18n }}</template>
            </el-table-column>
            <el-table-column :label="$t('label.formLearning')">
              <template slot-scope="scope">{{ scope.row.formLearningI18n }}</template>
            </el-table-column>
            <el-table-column label="导师">
              <template slot-scope="scope">{{ scope.row.oldTeacher }}</template>
            </el-table-column>
          </edu-table>
        </div>
      </el-card>
      <apply-form-to-tutor
        :isNull = "isNull"
        ref="applyForm"
        :options="options"
        :students="this.selectedStudents"
        @close="handleReturn"
      />
    </div>
    <div v-if="indexKey == '2'">
      <el-card shadow="never">
        <div v-if="currentStudent">
          <div class="edu-page-title">学生信息</div>
          <hr style="margin:15px 0 10px 0" />
          <el-form
            label-position="right"
            label-width="150px"
            label-suffix="："
            id="stu-info"
          >
            <el-row>
              <el-col :span="colSpan">
                <el-form-item
                  :label="$t('label.stuCode')"
                >{{currentStudent.studentId}}</el-form-item>
              </el-col>
              <el-col :span="colSpan">
                <el-form-item :label="$t('label.stuName')">{{currentStudent.studentName}}</el-form-item>
              </el-col>
              <el-col :span="colSpan">
                <el-form-item
                  :label="$t('label.college')"
                >{{currentStudent.facultyI18n}}</el-form-item>
              </el-col>
              <el-col :span="colSpan">
                <el-form-item
                  :label="$t('label.major')"
                >{{currentStudent.professionI18n}}</el-form-item>
              </el-col>
              <el-col :span="colSpan">
                <el-form-item :label="$t('label.grade')">{{currentStudent.grade}}</el-form-item>
              </el-col>
              <el-col :span="colSpan">
                <el-form-item :label="$t('label.teacherName')">{{currentStudent.oldTeacher}}</el-form-item>
              </el-col>
              <el-col :span="colSpan">
                <el-form-item
                  :label="$t('label.trainingLevel')"
                >{{currentStudent.trainingLevelI18n}}</el-form-item>
              </el-col>
              <el-col :span="colSpan">
                <el-form-item
                  :label="$t('label.trainingCategory')"
                >{{currentStudent.trainingCategoryI18n}}</el-form-item>
              </el-col>
              <el-col :span="colSpan">
                <el-form-item
                  :label="$t('dic.degreeType')"
                >{{currentStudent.degreeTypeI18n}}</el-form-item>
              </el-col>
              <el-col :span="colSpan">
                <el-form-item
                  :label="$t('label.formLearning')"
                >{{currentStudent.formLearningI18n}}</el-form-item>
              </el-col>
            </el-row>
          </el-form>
        </div>
        <hr style="margin:0 0 15px 0" />
        <!--详情isRead为false 为申请单详情页面-->
        <div v-if="!isRead">
          <div class="edu-page-title">申请明细</div>
          <table class="table-detail">
            <col width="15%" />
            <col width="35%" />
            <col width="15%" />
            <col width="35%" />
            <tr>
              <td class="label">
                <span>申请原因：</span>
              </td>
              <td colspan="3">
                <span>{{currentStudent.applyReasonI18n}}</span>
              </td>
            </tr>
            <tr>
              <td class="label">
                <span>转入导师：</span>
              </td>
              <td colspan="3">
                <span>{{currentStudent.newTeacherId}}</span>
              </td>
            </tr>
            <tr>
              <td class="textarealabel">
                <span>原因说明：</span>
              </td>
              <td colspan="3">
                <span>{{currentStudent.reasonDescri}}</span>
              </td>
            </tr>
            <tr>
              <td class="label">
                <span>申请材料：</span>
              </td>
              <td colspan="3">
                <!-- <div
                  :key="index"
                  v-for="(file,index) in currentStudent.changeTutorEvidList"
                >
                  <a
                    href="#"
                    @click="handleDownLoad(file)"
                  >{{getFileName(file.name)}}</a>
                </div> -->
                <PreviewOffice
                  :newFileList="currentStudent.changeTutorEvidList"
                  />
              </td>
            </tr>
          </table>
        </div>
      </el-card>
      <el-card shadow="never" v-if="isShowApproveHistory">
        <div class="edu-page-title">
          审批进度<i class="el-icon-arrow-down hideBtn" style="mar" @click="hideFrom"></i>
        </div>
        <div v-if="hide">
          <edu-table
            :pagination="false"
            style="margin-top:10px"
            :order="false"
            :selection="false"
            :data="currentStudentApproveHistory"
            key='approval'
          >
            <el-table-column :label="$t('message.order')" prop="order_" width="50" />
            <el-table-column label="时间" >
              <template slot-scope="scope">{{moment(scope.row.approvalTime)}}</template>
            </el-table-column>
            <el-table-column label="审批人"  prop="reviewerName"/>
            <el-table-column :label="$t('label.operation')"  prop="processOperat"></el-table-column>/>
            <el-table-column label="节点" prop="processNodes"></el-table-column>/>
            <el-table-column show-overflow-tooltip label="说明"  prop="reasonDescri" />
          </edu-table>
        </div>
      </el-card>
    </div>
    <el-dialog v-drag-dialog title="组内用户明细" :visible.sync="showUserGroupDialog">
      <edu-table
        :total="queryUserForm.total"
        @page-change="pageChangeDialog"
        :data="usersUnderGroup"
        :selection="false"
      >
        <el-table-column label="账号">
          <template slot-scope="scope">{{ scope.row.studentId }}</template>
        </el-table-column>
        <el-table-column label="用户名">
          <template slot-scope="scope">{{ scope.row.name }}</template>
        </el-table-column>
        <el-table-column label="联系电话">
          <template slot-scope="scope">{{ scope.row.phoneNumber }}</template>
        </el-table-column>
        <el-table-column label="联系邮箱" min-width="150">
          <template slot-scope="scope">{{ scope.row.email }}</template>
        </el-table-column>
        <el-table-column label="类型">
          <template slot-scope="scope">
            {{
            scope.row.userType == "1"
            ? "老师"
            : scope.row.userType == "2"
            ? "学生"
            : "本地用户"
            }}
          </template>
        </el-table-column>
      </edu-table>
    </el-dialog>
  </div>
</template>
<script>
import { queryDic } from "common/src/api/dictionary";
import { getStudentInfoToTutor, getStuTeas, getListInfoToTutor, getChangeTutorHistory } from "common/src/api/culture/change";
import { graduateDegreeList } from "common/src/api/culture/eduProfession";
import { downloadfile } from "common/src/api/upload";
import stu from 'common/src/api/studentinfo'
import ApplyFormToTutor from "./ApplyFormToTutor";
import { getUserInfoListByGroupId } from "common/src/api/user";
import PreviewOffice from "common/src/components/common/PreviewOffice.vue"
import mixin from 'common/src/mixins/index';
export default {
  name: "AgentApplyToTutor",
  mixins: [mixin],
  props: {
    //type 1 为管理员代申请，2为教务员代申请
    type: {
      default: null,
      required: true
    }
  },
  components: {
    ApplyFormToTutor,
    PreviewOffice
  },
  data: function() {
    return {
      isNull: '',
      currentStudentApproveHistory: [],
      hide: true,
      isRead: false,
      isShowApproveHistory: true,
      applyReasonList:[],
      approvalStatusList:[],
      showUserGroupDialog: false,
        queryUserForm: {
          userName: "",
          pageNum_: 1,
          total: 0,
          pageSize_: 20,
          groupId: ""
        },
      queryForm: {
        // grade: null,
        // faculty: null,
        // profession: null,
        // trainingLevel: null,
        // trainingCategory: null,
        // degreeType: null,
        // formLearning: null,
        // keyWord: null,
        // pageSize_: 20,
        // pageNum_: 1,
        // total_: 0
        grade: null,
        faculty: null,
        facultyList:[],
        profession: null,
        professionList: [],
        trainingLevel:null,
        trainingCategory: null,
        degreeType: null,
        formLearning: null,
        applyReason: null,
        approvalStatus: null,
        keyWord: null,
        pageSize_: 20,
        pageNum_: 1,
        total_: 0,
        ids:null
      },
      options: {
        faculty: [],
        profession: [],
        trainingLevel: [],
        trainingCategory: [],
        degreeType: [],
        formLearning: [],
        applyReason: [],
        enrolSeason: [],
        masProfessions: [],
        masTeachers: [],
        approvalStatus: []
        
      },
      students: null,
      currentStudent: null,
      indexKey: "0",
      searchStudentId: '',
      breadPath: {
        label: "转导师",
        key: "0",
        children: [
          {
            key: "1",
            label: this.type == "1" ? "管理员代申请" : "教务员代申请"
          },
          {
              key: "2",
              label: ""
          }
        ]
      },
      selectedStudents: [
          {
            stuName:'',
            facultyI18n: '',
            professionI18n: '',
            grade: '',
            oldTeacher:'',
            trainingLevelI18n: '',
            trainingCategoryI18n: '',
            degreeTypeI18n: '',
            formLearningI18n: ''
          }
      ]
    };
  },
  computed: {
    isSingleStudent: function() {
      return this.selectedStudents && this.selectedStudents.length > 1
        ? true
        : false;
    },
    colSpan() {
      if (this.selectedStudents == null || this.selectedStudents.length != 1) {
        return 6;
      }

      if (
        this.selectedStudents[0].facultyI18n &&
        this.selectedStudents[0].facultyI18n.length >= 8
      ) {
        return 8;
      }
      if (
        this.selectedStudents[0].professionI18n &&
        this.selectedStudents[0].professionI18n.length >= 8
      ) {
        return 8;
      }
      return 6;
    }
  },
  mounted() {
    this.init();
  },
  methods: {
    init() {
      const data = {
        lang: this.$store.getters.language || "cn",
        type: "allChild",
        keys: [
          "X_YX",
          "X_PYCC",
          "X_PYLB",
          "X_XWLX",
          "X_XXXS",
          "X_RXFS",
          "K_ZDYY",
          "K_ZDSH"
        ]
      };
      queryDic(data).then(res => {
        if (res.code === 200) {
          this.fill("faculty", res.data.X_YX);
          this.fill("trainingLevel", res.data.X_PYCC);
          this.fill("trainingCategory", res.data.X_PYLB);
          this.fill("degreeType", res.data.X_XWLX);
          this.fill("formLearning", res.data.X_XXXS);
          this.fill("applyReason", res.data.K_ZDYY);
          this.fill("approvalStatus", res.data.K_ZDSH);
        }
      });
      graduateDegreeList({ pageNum_: 1, pageSize_: 1000, type: 2 }).then(
        res => {
          if (res.code == 200) {
            this.options.masProfessions = res.data.list.map(row => {
              return {
                label: row.name,
                value: row.code
              };
            });
          }
        }
      );
      getStuTeas().then(res => {
        if (res.code == 200) {
          let teachers = [];
          for (let key in res.data) {
            this.options.masTeachers.push({
              label: res.data[key] + "(" + key + ")",
              value: key
            });
          }
        }
      });
      this.onSubmit();
    },
    fill(type, data) {
      for (const key in data) {
        this.options[type].push({
          value: key,
          label: data[key]
        });
      }
    },
    getOneStu() {
            let parm = {
                pageSize_: 1,
                pageNum_: 1,
                studentId: this.searchStudentId

            }
            if(this.searchStudentId) {
            getStudentInfoToTutor(parm).then(res => {
                if (res.code == 200 && res.data && res.data.list.length > 0) {
                    this.selectedStudents = res.data.list;
                    // getStudentInfo(
                    //     this.selectedStudents.map(s => s.studentId).join(",")
                    // ).then(resT => {
                    //     if(resT.code === 200) {
                    //         // this.$refs.applyForm.init();
                    //     }
                    // });
                } else {
                    this.$message.error('未查询到学生信息')
                    this.searchStudentId = ''
                    this.selectedStudents = [
                      {
                        stuName:'',
                        facultyI18n: '',
                        professionI18n: '',
                        grade: '',
                        oldTeacher:'',
                        trainingLevelI18n: '',
                        trainingCategoryI18n: '',
                        degreeTypeI18n: '',
                        formLearningI18n: ''
                      }
                  ]
                }
            });
        } else {
            this.searchStudentId = ''
              this.selectedStudents = [
                {
                  stuName:'',
                  facultyI18n: '',
                  professionI18n: '',
                  grade: '',
                  oldTeacher:'',
                  trainingLevelI18n: '',
                  trainingCategoryI18n: '',
                  degreeTypeI18n: '',
                  formLearningI18n: ''
                }
            ]
          }
        },
    reset() {
      // this.queryForm.grade = null;
      // this.queryForm.faculty = null;
      // this.queryForm.profession = null;
      // this.queryForm.trainingLevel = null;
      // this.queryForm.trainingCategory = null;
      // this.queryForm.degreeType = null;
      // this.queryForm.formLearning = null;
      // this.queryForm.enrolMethods = null;
      // this.queryForm.keyWord = null;
      // this.options.profession.length = 0;
        this.queryForm.grade = null;
        this.queryForm.faculty = null;
        this.queryForm.facultyList = [];
        this.queryForm.profession = null;
        this.queryForm.professionList = [];
        this.queryForm.trainingLevel = null;
        this.queryForm.trainingCategory = null;
        this.queryForm.degreeType = null;
        this.queryForm.formLearning = null;
        this.queryForm.applyReason = null;
        this.queryForm.approvalStatus = null;
        this.applyReasonList = [];
        this.approvalStatusList = [];
        this.queryForm.keyWord = null;
        this.options.profession.length = 0;
        this.queryForm.ids = "";
      this.onSubmit();
    },
    handleDetail(scope) {
        this.isRead = false;
        this.currentStudent = _.cloneDeep(scope.row);
        /*debugger*/
        this.currentStudent.teacherName = scope.row.oldTeacher;
        // this.currentStudent.changeTutorEvidList = (scope.row.changeTutorEvid.substring(0,1)).toString() === '[' ?  JSON.parse(scope.row.changeTutorEvid) : scope.row.changeTutorEvid.split(",");
        if(scope.row.changeTutorEvid && scope.row.changeTutorEvid.length > 0) {
        if((scope.row.changeTutorEvid.substring(0,1)).toString() === '[') {
          this.currentStudent.changeTutorEvidList = JSON.parse(scope.row.changeTutorEvid)
        } else {
          let filesList = []
          let evidList = scope.row.changeTutorEvid.split(",")
          evidList.map(files=> {
            filesList.push(
              {
                name: files,
                url: files
              }
            )
          })
          this.currentStudent.changeTutorEvidList = filesList
        }
       }
        this.indexKey = "2";
        this.breadPath.children[1].label = this.$t("message.detail");
        //是否显示审批进度 如果管理员申请数据 不显示审批进度
        this.isShowApproveHistory = (scope.row.applyType == "3") ? false : true;
        //获取当前学生的审批历史
        this.getCurrentStudentApproveHistory(this.currentStudent.workflowNo);
      },
      getCurrentStudentApproveHistory(workflowNo){
        getChangeTutorHistory(workflowNo).then(res => {
          if (res.code == 200) {
            res.data.forEach((row, index) => {
              row.order_ = index + 1;
            });
            this.currentStudentApproveHistory = res.data;
          }
        });

      },
      handleDownLoad(file) {
        // downloadfile(file.url);
        let url = '/api/commonservice/obsfile/downloadfile?objectkey=' + file.url  
        let name = file.name
        stu.downTemplate(name, url);
      },
      moment(val) {
        return moment(val).format("YYYY-MM-DD HH:mm:ss");
      },
      getFileName(path) {
        if (path && path.indexOf("/") != -1) {
          return path.substring(path.lastIndexOf("/") + 1);
        } else {
          return path;
        }
      },
      hideFrom(){
        this.hide = !this.hide;
      },
      showUserGroup(groupId = "") {
        // this.queryUserForm.groupId = groupId;
        this.$set(this.queryUserForm, "groupId", groupId);
        this.showUserGroupDialog = true;
        this.getUserInfoListByGroupId();
      },
      async getUserInfoListByGroupId() {
        try {
          if (!this.queryUserForm.groupId) {
            this.$message({
              type: "error",
              message: "查询出错, 请重试."
            });
            return;
          }
          let { code, data } = await getUserInfoListByGroupId(
            this.queryUserForm
          );
          if (code == 200) {
            this.usersUnderGroup = data ? data.list : [];
            this.queryUserForm.total = data.total_;
          }
        } catch (err) {
          this.$message({
            type: "error",
            message: "查询出错, 请重试."
          });
        }
      },
      pageChangeDialog(val) {
        this.queryUserForm.pageSize_ = val.pageSize;
        this.queryUserForm.pageNum_ = val.pageNum;
        this.getUserInfoListByGroupId();
      },
    onSubmit(isFirstPage = true) {
      if (isFirstPage) {
        this.queryForm.pageNum_ = 1;
      }
      this.queryForm.applicant = this.global.currentUser.uid
      // 申请原因、审核状态是多选 后台接受字符串，所以处理一下
      this.queryForm.applyReason = this.applyReasonList.toString();
      this.queryForm.approvalStatus = this.approvalStatusList.toString();
      this.queryForm.faculty = this.queryForm.facultyList.toString();
      this.queryForm.profession = this.queryForm.professionList.toString();
      getListInfoToTutor(this.queryForm).then(res => {
        if (res.code == 200) {
          res.data.list.forEach((row, index) => {
            row.index_ =
              this.queryForm.pageSize_ * (this.queryForm.pageNum_ - 1) +
              index +
              1;
          });
          this.students = res.data.list;
          this.queryForm.total_ = res.data.total_;
        }
      });
    },
    handleAgentApply() {
      // this.selectedStudents=[student]
      this.$refs.applyForm.init();
      this.indexKey = "1";
      this.isNull = '1';
      this.searchStudentId = ''
      this.selectedStudents = [
        {
            stuName:'',
            facultyI18n: '',
            professionI18n: '',
            grade: '',
            oldTeacher:'',
            trainingLevelI18n: '',
            trainingCategoryI18n: '',
            degreeTypeI18n: '',
            formLearningI18n: ''
          }
      ]

    },
    handleCurrentChange(val) {
      this.queryForm.pageSize_ = val.pageSize;
      this.queryForm.pageNum_ = val.pageNum;
      this.onSubmit(false);
    },
    handleChangeFaculty() {
      this.options.profession = [];
      this.queryForm.profession = null;
      this.queryForm.professionList = [];
      if (!this.queryForm.facultyList) {
        return;
      }
      const data = {
        lang: this.$store.getters.language || "cn",
        type: "allChild",
        keys: ["G_ZY"],
        filter: {
          prefix: this.queryForm.facultyList,
          specilaCode: "XY2ZY",
          grade: null,
          facultys: this.queryForm.facultyList,
          degreeType: this.queryForm.degreeType
            ? [this.queryForm.degreeType]
            : []
        }
      };
      queryDic(data).then(res => {
        if (res.code === 200) this.fill("profession", res.data.G_ZY);
      });
    },
    handleReturn() {
      this.indexKey = "0";
      this.onSubmit();
    }
  }
};
</script>

<style lang="scss" scoped>
#stu-info {
  ::v-deep .el-form-item--small.el-form-item {
    margin-bottom: 5px;
  }
}
.table-detail {
    width: 100%;
    border-collapse: collapse;
    border: 1px solid #d2d4d6;
    td {
      border-collapse: collapse;
      border: 1px solid #d2d4d6;
      line-height: 32px;
    }
    .label {
      text-align: right;
      background: #f5f7f9;
      color: #8896a7;
    }
    .textarealabel{
      text-align: right;
      background: #f5f7f9;
      color: #8896a7;
      line-height:105px;
    }
    span {
      margin: 0 10px;
    }
  }
</style>
